@(title: String)(content: Html)

@import play.i18n._

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<html>
    <head>
        <title>@title</title>
        <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/style.css")">
        <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/list.css")">
        <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/input.css")">
        <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/look.css")">
        <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/button.css")">
		<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/layer.css")">
		<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/menu.css")">
		<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/popup.css")">
        <link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/jquery-ui-1.10.2.custom.css")">
        
        <script src="@routes.Assets.at("javascripts/jquery-1.9.0.min.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/jquery-ui-1.10.2.custom.js")" type="text/javascript"></script>
        <!-- <script src="https://www.youtube.com/iframe_api"></script>-->
        <script src="@routes.Assets.at("javascripts/constants.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/youtube_repeat.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/common_event.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/cufon-yui.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/Titillium.font.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/crossBrowser.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/localStorage.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/cookieStorage.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/storage.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/common_ajax.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/knockout-2.2.1.js")" type="text/javascript"></script>
        <script src="@routes.Assets.at("javascripts/planetxsdk.js")" type="text/javascript"></script>
        
        <script type="text/javascript" src="http://widgets.twimg.com/j/2/widget.js"></script>
        <script type="text/javascript">
	       
        
	        var _gaq = _gaq || [];
	        _gaq.push(['_setAccount', 'UA-40462744-1']);
	        _gaq.push(['_trackPageview']);

	        (function() {
	        	var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
	            ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
	            var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
	        })();
	        
        	var playGroupListModel;
			Cufon.replace('h1');
			
			$(document).ready(function(){
				searchYoutube(rowCount, startPage);
				
				setKeyDownEvent(13, $("#searchName"), function(){
					searchYoutube(rowCount, startPage);
				});
				
				$(function() {
					$('.cloud_bar').css('marginLeft', '-250px');
			
			        $('.cloud_bar').hover(
			            function () {
			                $(this).stop().animate({'marginLeft':'-2px'},500);
			            },
			            function () {
			                $(this).stop().animate({'marginLeft':'-250px'},500);
			            }
			        );
			    });
				
				settingGroupYoutube();
//				
				$("#pop_group" ).draggable();
				//$("#pop_music_count" ).draggable();
				
				$("#pop_removeItems").click(function(){
					var increaseJ = 0;
					$("#group_div_body").find("input").each(function(i, opts){
						if(opts.checked){
							var num = $(opts).attr("num");
							removeStorage(num-increaseJ);
							increaseJ++;
						}
					});
					settingGroupYoutube();
				});
			
				$("#pop_close").click(function(){
					$("#pop_group").hide();
				});
				
				/*$("#pop_music_count_close").click(function(){
					$("#pop_music_count").hide();
				});*/
				
				$("#pop_oneplay").click(function(){
					$("#pop_group_header").text('@Messages.get("title.youtube.list.one")');
					playType = PLAYTYPE_ONE;
				});
				
				$("#pop_autoplay").click(function(){
					$("#pop_group_header").text('@Messages.get("title.youtube.list.all")');
					playType = PLAYTYPE_AUTO;
				});
				
				$("#pop_new").click(function(){
					$("#mw_temp").show();
				});
				
				$("#pop_save").click(function(){
					var password = prompt("패스워드를 입력해 주십시요.","xxxxxx");
					if(password != null){
						var params = getAllPlayListParams();
						params["id"] = playGroupListModel.selGroupId;
						params["password"] = password;
						call_ajax_json('@routes.Repeat.save()', params, function(data){
							alert("성공 했습니다.");
							playGroupListModel.findGroupList();
						});
					}
				});				
				
				$("#pop_mp3download").click(function(){
					$(this).find("span").text("다운로드중...");
					mp3DownFunc();
					$(this).prop("onclick", null);
				});
				
				var mp3DownFunc = function(){
					var downIds = "";
					$("input:checkbox[name='rejection']:checked").each(function(){
						var id = $(this).val();
						var name = $(this).attr("kname");
						
						downIds += id+"\u0002"+name+"\u0001";
					});
					
					$.ajax({
				        type : 'POST',
				        url : '/repeat/download',
				        data : {dwcode:downIds},
				        dataType : "json",
				        success : function(data) {
				        	if(data != null){
				    			$("#dwcode").val(data.keyName);
				    			$("#downloadFrm").submit();
				    			
				    			$("#pop_mp3download").click(function(){
									$(this).find("span").text("다운로드중...");
									mp3DownFunc();
									$(this).prop("onclick", null);
								});
				    		}
				        }
				    });
				}
				
				var _playGroupListModel = function() {
				    var self = this;
				    
				    self.groupListData = ko.observable();
				    self.groupText = ko.observable("");
				    self.selGroupId = "";
				    
				    self.musicCountListData = ko.observable();
				    
				    self.findGroupList = function() { 
				        call_ajax_json('@routes.Repeat.grouplist()', {}, self.groupListData);
				    };
				    
				    self.findMusicCountList = function() { 
				        call_ajax_json('@routes.Analysis.viewmusiccount()', {}, self.musicCountListData);
				    };
				    
				    self.searchgrouplist = function() { 
				        call_ajax_json('@routes.Repeat.searchgrouplist()', {text: self.groupText}, self.groupListData);
				    };
				    
				    self.findPlayList = function(group) { 
				    	self.selGroupId = group.id;
				    	call_ajax_json("@routes.Repeat.playlist()", { groupId: group.id }, function(data){
				    		if(data.playlist != null){
				    			settingPlayList(data.playlist);
				    		}
				    	});
				    };
				    self.findGroupList();
				    self.findMusicCountList();
				};
				playGroupListModel = new _playGroupListModel();
				ko.applyBindings(playGroupListModel);
				
				ko.bindingHandlers.returnKey = {
					init: function(element, valueAccessor, allBindingsAccessor, viewModel) {
						ko.utils.registerEventHandler(element, 'keydown', function(evt) {
							if (evt.keyCode === 13) {
								evt.preventDefault();
								evt.target.blur();
								valueAccessor().call(viewModel);
						 	}
						});
					}
				 };
			});
			
			function nextPage(){
				startPage += 10;
				searchYoutube(rowCount, startPage);
			}
			
			function prevPage(){
				if(startPage - 10 > 0){
					startPage -= 10;
					searchYoutube(rowCount, startPage);
				}else{
					alert('@Messages.get("alert.message.firstpage")');
				}
			}
			
			function newlist(){
				var title = $("#listTitle").val();
				var password = $("#listPass").val();
				if(title != null){
					var params = getAllPlayListParams();
					params["title"] = title;
					params["password"] = password;
					call_ajax_json('@routes.Repeat.newlist()', params, function(data){
						alert("성공 했습니다.");
						playGroupListModel.findGroupList();
						$("#mw_temp").hide();
					});	
				}else{
					alert("title을 입력 하지 않으 셨습니다.");
				}
			}
			
		</script>
        <link rel="shortcut icon" type="image/png" href="@routes.Assets.at("images/favicon.png")">
    </head>
    <body>
   <form id="downloadFrm" name="downloadFrm" action="@routes.Repeat.fileDownLoad()" method="post">
        <input type="hidden" id="dwcode" name="dwcode" value="" />
	</form>
    
        @content
    </body>
</html>
